
import 'package:flutter/material.dart';
import 'package:flutter/rendering.dart';
import 'package:flutter/widgets.dart';
import 'package:flutter_app/water_fall/view_image.dart';
import 'package:flutter_app/water_fall/water_fall_data.dart';

List<String> _imageUris = <String>[];
class WaterfallStream extends StatefulWidget{
  @override
  State<StatefulWidget> createState() {
    return WaterfallState();
  }

}

class WaterfallState extends State{
  @override
  void initState() {
    super.initState();
  }
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('瀑布流'),
          leading: IconButton(
            icon: Icon(Icons.arrow_back),
            onPressed: () {
              Navigator.of(context).pop();
            },
          ),
        ),
        body: Container(
          margin: EdgeInsets.all(12),
          child: WaterFallImageProvider(context,18),
        ),
      ),
    );
  }

}

class WaterFallImageProvider extends StatefulWidget{
  final BuildContext _context;
  final int _mNum;
  WaterFallImageProvider(this._context,this._mNum);

  @override
  State<StatefulWidget> createState() {
    return WaterFallImageState(_context,_mNum);
  }
}

class WaterFallImageState extends State{
  final BuildContext _context;
  final int _mNum;
  bool destroyed;
  GetImageUri getImageUri = GetImageUri();
  WaterFallImageState(this._context,this._mNum);

  @override
  void initState() {
    super.initState();
    destroyed = false;
    getImageUri.getImageUri(_mNum).then((value){
      if(!destroyed){
        setState(() {
          _imageUris.addAll(value);
        });
      }
    });
  }

  @override
  Widget build(BuildContext context) {
    return _randomImageView(_mNum);
  }

  @override
  void dispose() {
    super.dispose();
    destroyed = true;
  }
  Widget _randomImageView(int num) {
    if (_imageUris == null || _imageUris.length == 0){
      return Center(child: CircularProgressIndicator(),);
    } else {
      return GridView.builder(
        physics: BouncingScrollPhysics(),
        itemCount: _imageUris.length + 2,
        gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
          crossAxisCount: 3,
          mainAxisSpacing: 8.0,
          crossAxisSpacing: 8.0,
        ),
        itemBuilder: (context,index){
          if (index >= _imageUris.length ) {
            if(index == _imageUris.length){
              return SizedBox(
                width: 1,
                height: 1,
                child: Container(),
              );
            } else if (index == _imageUris.length + 1){
              getImageUri.getImageUri(num).then((value){
                if(!destroyed){
                  setState(() {
                    _imageUris.addAll(value);
                    while(_imageUris.length % 3 != 0){
                      _imageUris.removeLast();
                    }
                  });
                }
              });
              return SizedBox(
                height: 1,
                width: 1,
                child: Container(
                  alignment: Alignment.center,
                  margin: EdgeInsets.all(12),
                  child: Stack(
                    children: <Widget>[
                      Container(alignment: Alignment.center,child: CircularProgressIndicator()),
                      Container(alignment: Alignment.topCenter,child: Text("正在加载"))
                    ],
                  ),
                ),
              );
            }
          }
          return GestureDetector(
            onTap: (){
              Navigator.of(_context).push(MaterialPageRoute(builder: (route) => ViewImage(_imageUris,index)));
            },
            child: Card(
              elevation: 10,
              child: FadeInImage(
                fit: BoxFit.cover,
                placeholder: AssetImage('assets/loading_cute.gif'),
                image: NetworkImage(
                  _imageUris[index],
                ),
              ),
            ),
          );
        },
      );
    }
  }
}